<template>
  <a-spin :spinning="confirmLoading">
    <j-form-container :disabled="formDisabled">
      <a-form :form="form" slot="detail">
        <a-row>
          <a-col :span="12">
            <a-form-item label="所属项目" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input v-decorator="['productBelongValue']" id="productBelongValue" placeholder="请输入所属项目" disabled></a-input>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="物料大类" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input v-decorator="['applyId']" id="applyId" placeholder="请输入物料大类" disabled></a-input>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="物料子类" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input v-decorator="['productId']" id="productId" placeholder="请输入物料子类" disabled></a-input>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="物料名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input v-decorator="['productNameValue']" placeholder="请输入物料名称" disabled></a-input>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="制造厂商" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input v-decorator="['factory']" id="factory" placeholder="请输入制造厂商" disabled></a-input>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="规格型号" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input v-decorator="['productTypeName']" id="productTypeName" placeholder="请输入规格型号" disabled></a-input>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="设备编号" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input v-decorator="['productEncoding']" id="productEncoding" placeholder="请输入设备编号" disabled></a-input>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="警告数量" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input id="riskSurplus"  placeholder="请输入警告数量" disabled></a-input>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="回库状态" :labelCol="labelCol" :wrapperCol="wrapperCol">
             
              
              <a-select
                show-search
                placeholder="请输入出回库状态"
                option-filter-prop="children"
                style="width: 200px"
                :filter-option="filterOption"
                @focus="handleFocus"
                @blur="handleBlur"
                @change="handleChange"
                @select="Select"
              >
                  <a-select-option v-for="val in this.dictOptions" :key="val.value"  id="fan">
                      {{val.text}}
                  </a-select-option>
            </a-select>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="入库数量" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-input  placeholder="请输入入库数量" @change="changeNum()" id="Num"></a-input>
            </a-form-item>
          </a-col>
          <a-col :span="24" style="margin-left:-90px;">
            <a-form-item label="设备用途" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-textarea placeholder="请输入设备用途" :auto-size="{ minRows: 3, maxRows: 5 }" disabled/>
            </a-form-item>
          </a-col>
          <a-col :span="24" style="margin-left:-90px;">
            <a-form-item label="备注" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <a-textarea placeholder="请输入备注" :auto-size="{ minRows: 3, maxRows: 5 }" @change="changeRemark()" id="remark"/>
            </a-form-item>
          </a-col>
        </a-row>
      </a-form>
    </j-form-container>
  </a-spin>
</template>

<script>
import { httpAction, getAction } from '@/api/manage'
import pick from 'lodash.pick'
import { validateDuplicateValue } from '@/utils/util'
import JFormContainer from '@/components/jeecg/JFormContainer'
import {getCookie,setCookie} from '@/utils/cookie'
import JSearchSelectTag from '@/components/dict/JSearchSelectTag'

export default {
  name: 'DtApplyMaterielForm',
  components: {
    JFormContainer,
  JSearchSelectTag
  },
   props:['aa'], 
  data() {
    return {
      code:'',
      Id:'',
      selectValue:"",
       dictOptions:[{
          text:"待检测",
          value:"1"
        },{
          text:"已报废",
          value:"2"
        },{
          text:"回库可用",
          value:"3"
        }],
        backtype:'',
      productPutInAmount:'',
      remark:'',
      ModalText: 'Content of the modal',
      visible:getCookie('visible'),
      confirmLoading: false,
      productEncoding:'',
      form: this.$form.createForm(this),
      model: {},
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 }
      },
      confirmLoading: false,
      validatorRules: {},
      url: {
        add: '/dtapplymateriel/dtApplyMateriel/add',
        edit: '/dtapplymateriel/dtApplyMateriel/edit',
        queryById: '/dtapplymateriel/dtApplyMateriel/queryById',
        scanA:'/dt_product_put_in_storage/dtProductPutInStorage/scanA'
      }
    }
  },
  computed: {
    formDisabled() {
      if (this.formBpm === true) {
        if (this.formData.disabled === false) {
          return false
        }
        return true
      }
      return this.disabled
    },
    showFlowSubmitButton() {
      if (this.formBpm === true) {
        if (this.formData.disabled === false) {
          return true
        }
      }
      return false
    }
  },
  created() {
   
    //如果是流程中表单，则需要加载流程表单data
    this.showFlowData()
    //扫码枪
     var code = ''
    document.onkeypress = function(e) {
      if(e.code!="Enter"){
          code+=e.key;
      }else{
          console.log('3code',code);
          var params = {productEncoding:code}
          var scanA = '/dt_product_put_storage/dtProductPutStorage/scanA'
           getAction(scanA, params).then(res => {
          console.log('a',res)
          code = ''
          document.querySelector('#productBelongValue').value = res.result.productBelongValue
          document.querySelector('#productNameValue').value = res.result.productNameValue
          document.querySelector('#productTypeName').value = res.result.productTypeName
          document.querySelector('#productEncoding').value = res.result.productEncoding
          document.querySelector('#riskSurplus').value = res.result.riskSurplus
          this.Id =  res.result.id
         setCookie('productId',res.result.id)
            var scanB = '/dt_product_put_storage/dtProductPutStorage/scanB'
            var params1 = {
              productEncoding:code,
              productBelong:res.result.productBelong,
              equipTypeCode:res.result.equipTypeCode
              }
              var productBelong = res.result.productBelong
              var orgCode = res.result.orgCode
              var equipSubtypeCode = res.result.equipSubtypeCode
              var factoryName = res.result.factoryName
            getAction(scanB, params1).then(res => {
              console.log('b',res)
               document.querySelector('#applyId').value = res.result[0].text
               var scanC = '/dt_product_put_storage/dtProductPutStorage/scanC'
                  var params2 = {
                productBelong:productBelong,
                orgCode:orgCode,
                equipSubtypeCode:equipSubtypeCode
                }
                getAction(scanC, params2).then(res => {
                console.log('c',res)
                if(res.result.length == 0){
                  document.querySelector('#productId').value = ''
                }else{
                   document.querySelector('#productId').value = res.result[0].text1
                }
               
                var scanD = '/dt_product_put_storage/dtProductPutStorage/scanD'
                var params3={
                  productBelong:productBelong,
                orgCode:orgCode,
                factoryName:factoryName,
                }
                  getAction(scanD, params3).then(res => {
                    console.log('d',res)
                     document.querySelector('#factory').value = res.result[0].text2
              
                })
                })
              })
        })
      }
        
    }

  },
  mounted() {

  },
  methods: {
    handleChange(value) {
      console.log(`selected ${value}`);
      this.getfan = value
    },
    Select(val){
      console.log('选择是',val)
      this.backtype = val
    },
    handleBlur() {
      console.log('blur');
    },
    handleFocus() {
      console.log('focus');
    },
     filterOption(input, option) {
      return (
        option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
      );
    },
    changeNum(){
      this.productPutInAmount = document.querySelector('#Num').value
    },
    changeRemark(){
      this.remark = document.querySelector('#remark').value
    },
    add() {
      this.edit({})
    },
    edit(record) {
      this.form.resetFields()
      this.model = Object.assign({}, record)
      this.visible = true
      this.$nextTick(() => {
        this.form.setFieldsValue(
          pick(
            this.model,
            'applyId',
            'productId',
            'productName',
            'productType',
            'applyNum',
            'wpgName',
            'wpgId',
            'orgCode',
            'orgName'
          )
        )
      })
    },
    //渲染流程表单数据
    showFlowData() {
      if (this.formBpm === true) {
        let params = { id: this.formData.dataId }
        getAction(this.url.queryById, params).then(res => {
          if (res.success) {
            this.edit(res.result)
          }
        })
      }
    },
    submitForm() {
      const that = this
      // 触发表单验证
      this.form.validateFields((err, values) => {
        if (!err) {
          that.confirmLoading = true
          let httpurl = ''
          let method = ''
          if (!this.model.id) {
            httpurl += this.url.add
            method = 'post'
          } else {
            httpurl += this.url.edit
            method = 'put'
          }
          let formData = Object.assign(this.model, values)
          console.log('表单提交数据', formData)
          httpAction(httpurl, formData, method)
            .then(res => {
              if (res.success) {
                that.$message.success(res.message)
                that.$emit('ok')
              } else {
                that.$message.warning(res.message)
              }
            })
            .finally(() => {
              that.confirmLoading = false
            })
        }
      })
    },
    popupCallback(row) {
      this.form.setFieldsValue(
        pick(
          row,
          'applyId',
          'productId',
          'productName',
          'productType',
          'applyNum',
          'wpgName',
          'wpgId',
          'orgCode',
          'orgName'
        )
      )
    }
  }
}
</script>